<!--
+----------------------------------------------------------------------
| 友得云客  - 开启房产营销新纪元
+----------------------------------------------------------------------
| Copyright (c) 2019~2023 优得（西安）信息科技有限公司版权所有
+----------------------------------------------------------------------
| Licensed 友得云客不是自由软件 未经允许不可移除相关版权
+----------------------------------------------------------------------
| Author: www.youdeyunke.com
+----------------------------------------------------------------------
-->
<template>
    <div class="header" v-cloak>
        <div :style="{ borderBottomColor: themeColor, fontSize: fontsize + 'px', color: fontcolor }" class="title">{{ title }}</div>
        <div class="subtitle">{{ subtitle }}</div>
    </div>
</template>

<script>
export default {
    data () {
        return {
            loading: false
        };
    },
    props: {
        title: { type: String, default: "" },
        subtitle: { type: String, default: "" },
        themeColor: { type: String, default: '#1989fa' },
        link: { type: Object, default: null },
        fontsize: { type: Number, default: 40 },
        fontcolor: { type: String, default: '#000000' },
    },

    mounted: function () { },

    computed: {
        arrow: function () {
            return this.link && this.link.cat !== "no";
        }
    },

    methods: {}
};
</script>

<style scoped>
.header {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding: 30px 30px 0 30px;
}

.title {
    font-size: 30px;
    font-weight: bold;
    color: #000;
    border-bottom-width: 8px;
    border-bottom-style: solid;
    padding-bottom: 6px;
    margin-bottom: 6px;
}

.subtitle {
    font-size: 24px;
    color: #999;
}

.subtitle .arrow {
    margin-left: 6px;
}
</style>